$warn-color-0 = #6E6E6E;
$warn-color-1 = #43ce17;
$warn-color-2 = #efdc31;
$warn-color-3 = #fa0;
$warn-color-4 = #ff401a;
$warn-color-5 = #d20040;
$warn-color-6 = #9c0a4e;
$warn-color-1-o50 = rgba(110, 110, 110, .5);
$warn-color-1-o50 = rgba(67, 206, 23, .5);
$warn-color-2-o50 = rgba(239, 220, 49, .5);
$warn-color-3-o50 = rgba(255, 170, 0, .5);
$warn-color-4-o50 = rgba(255, 64, 26, .5);
$warn-color-5-o50 = rgba(210, 0, 64, .5);
$warn-color-6-o50 = rgba(156, 10, 78, .5);

p, ul, ol, li, img, a
  margin 0
  padding 0
  moz-user-select -moz-none;
  -moz-user-select none;
  -o-user-select none;
  -khtml-user-select none;
  -webkit-user-select none;
  -ms-user-select none;
  user-select none;
  -webkit-tap-highlight-color: transparent;

ul, ol, li
  list-style none

a, a:hover
  text-decoration none

p.ellipsis
  overflow hidden
  white-space nowrap
  text-overflow ellipsis

img
  display block

.row
  position relative

  > .col
    float left
    position relative

.row::after
  content ''
  display block
  clear both

.warn-color-0
  background-color $warn-color-0

.warn-color-1
  background-color $warn-color-1

.warn-color-2
  background-color $warn-color-2

.warn-color-3
  background-color $warn-color-3

.warn-color-4
  background-color $warn-color-4

.warn-color-5
  background-color $warn-color-5

.warn-color-6
  background-color $warn-color-6

.leaflet
  >>> .leaflet-control-container
    > .leaflet-bottom.leaflet-right, > .leaflet-top.leaflet-left, > .leaflet-bottom.leaflet-left
      display none

  >>> .leaflet-popup-content-wrapper
    > .leaflet-popup-content
      p
        margin 0

  >>> .leaflet-pane
    p
      margin 0

    .warn-color-0
      background-color $warn-color-0-o50
      border 1px solid $warn-color-0

    .warn-color-1
      background-color $warn-color-1-o50
      border 1px solid $warn-color-1

    .warn-color-2
      background-color $warn-color-2-o50
      border 1px solid $warn-color-2

    .warn-color-3
      background-color $warn-color-3-o50
      border 1px solid $warn-color-3

    .warn-color-4
      background-color $warn-color-4-o50
      border 1px solid $warn-color-4

    .warn-color-5
      background-color $warn-color-5-o50
      border 1px solid $warn-color-5

    .warn-color-6
      background-color $warn-color-6-o50
      border 1px solid $warn-color-6

    .leaflet-marker-icon.aqi-icon
      > .warn-color-0
        border 1px solid $warn-color-0

        > .hornlike
          border-top 10px solid  $warn-color-0

      > .warn-color-1
        border 1px solid $warn-color-1

        > .hornlike
          border-top 10px solid  $warn-color-1

      > .warn-color-2
        border 1px solid $warn-color-2

        > .hornlike
          border-top 10px solid  $warn-color-2

      > .warn-color-3
        border 1px solid $warn-color-3

        > .hornlike
          border-top 10px solid  $warn-color-3

      > .warn-color-4
        border 1px solid $warn-color-4

        > .hornlike
          border-top 10px solid  $warn-color-4

      > .warn-color-5
        border 1px solid $warn-color-5

        > .hornlike
          border-top 10px solid  $warn-color-5

      > .warn-color-6
        border 1px solid $warn-color-6

        > .hornlike
          border-top 10px solid  $warn-color-6

.echarts
  >>> .echarts-tooltip
    p
      margin 0
      padding 0
      moz-user-select -moz-none;
      -moz-user-select none;
      -o-user-select none;
      -khtml-user-select none;
      -webkit-user-select none;
      -ms-user-select none;
      user-select none;
      -webkit-tap-highlight-color: transparent;

    p.ellipsis
      overflow hidden
      white-space nowrap
      text-overflow ellipsis

    .row
      position relative

    > .col
      float left
      position relative

    .row::after
      content ''
      display block
      clear both

    .warn-color-0
      background-color $warn-color-0

    .warn-color-1
      background-color $warn-color-1

    .warn-color-2
      background-color $warn-color-2

    .warn-color-3
      background-color $warn-color-3

    .warn-color-4
      background-color $warn-color-4

    .warn-color-5
      background-color $warn-color-5

    .warn-color-6
      background-color $warn-color-6
